<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:fn="http://java.sun.com/jsp/jstl/functions"
                template="/Facelets/Templates/template.xhtml">

    <ui:define name="content">	

        <script type="text/javascript">  
        function handleLoginRequest(xhr, status, args) {  
         if(args.validationFailed) {  
             jQuery('#dialog').parent().effect("shake", { times:2 }, 100);  
         } else {  
             dlgCadastro.hide();  
         }  
         }
     	
        </script> 
        <div class="ui-widget" style="padding-left: 10px; padding-top: 5px; padding-bottom: 14px;">
            <a href="#{request.contextPath}/index.faces" style="color: black;">Home</a> > Consulta de Equipamentos
        </div>
        <p:fieldset legend="Consulta de Equipamentos">
            <h:form id="formTabela">
                
                <p:fieldset>
                <table style="width: 100%; height: 100%;">
                <tr>
                <td style="width: 16%; text-align: left;">
                <p:panel header="Exportar todos os dados" style="width:200px">
                    <h:commandLink>
                        <p:graphicImage value="/imagens/excel.png" />
                        <p:dataExporter  type="xls" target="tabela" fileName="equipamentos" />
                    </h:commandLink>

                    <h:commandLink>
                        <p:graphicImage value="/imagens/pdf.png" />
                        <p:dataExporter type="pdf" target="tabela" fileName="equipamentos"/>
                    </h:commandLink>

                    <h:commandLink>
                        <p:graphicImage value="/imagens/csv.png" />
                        <p:dataExporter type="csv" target="tabela" fileName="equipamentos" />
                    </h:commandLink>

                    <h:commandLink>
                        <p:graphicImage value="/imagens/xml.png" />
                        <p:dataExporter type="xml" target="tabela" fileName="equipamentos" />
                    </h:commandLink>
                    
                </p:panel>
                    
                </td>
                <td style="width: 15%;"></td>
                <td><h:graphicImage value="/imagens/messagebox.png" /></td>
                <td style="text-align: left;">
                    <p>
                        <span style="color: cornflowerblue;" class="ui-widget">Nesta seção pode ser feito a consulta de <strong>equipamentos</strong>, bem como exportar a lista de resultados em PDF, CSV, XLS ou XML.</span><br/>
                        <span style="color: cornflowerblue;" class="ui-widget">Dica 1: Para filtrar uma busca, digite em algum dos campos [Tipo, Nº de Patrimônio, Rack] o ítem desejado.</span><br/>
                        <span style="color: cornflowerblue;" class="ui-widget">Dica 2: Para exportar a lista de resultados, selecione o formato no ícone correspondente ao lado esquerdo.</span>
               
                    </p>
                </td>
                <td style="width: 10%;"></td>
                </tr>
            </table>
                    
                </p:fieldset>

                
                <p:panel>
                    <p:dataTable id="tabela" rows="10" paginator="true" emptyMessage="Nenhum registro encontrado"
                                 paginatorPosition="top" value = "#{EquipamentosBean.equipamentos}"
                                 var="equipamento">
                        <f:facet name="header">Equipamentos</f:facet>

                        <p:column headerText="Tipo" style="width:300px" filterBy="#{equipamento.tipo}" sortBy="#{equipamento.tipo}">
                            <h:outputText value="#{equipamento.tipo}"/>
                        </p:column>

                        <p:column headerText="Descricao" style="width:600px">
                            <h:outputText value="#{equipamento.descricao}" />
                        </p:column>

                        <p:column headerText="N do Patrimônio" style="width:200px" filterBy="#{equipamento.numeroPatrimonio}" sortBy="#{equipamento.numeroPatrimonio}">
                            <h:outputText value="#{equipamento.numeroPatrimonio}"/>
                        </p:column>

                        <p:column headerText="Marca" style="width:200px">
                            <h:outputText value="#{equipamento.marca}" />
                        </p:column>

                        <p:column headerText="Modelo" style="width:300px">
                            <h:outputText value="#{equipamento.modelo}" />
                        </p:column>

                        <p:column headerText="Rack" style="width:100px" filterBy="#{equipamento.racknumero.numero}" sortBy="#{equipamento.racknumero.numero}">
                            <h:outputText value="#{equipamento.racknumero.numero}" />
                        </p:column>

                        <f:facet name="footer">  
                            #{fn:length(EquipamentosBean.equipamentos)} Equipamentos no total.  
                        </f:facet>
                    </p:dataTable>


                </p:panel>

            </h:form>
        </p:fieldset>
    </ui:define>
</ui:composition>